<template>
  <div>
    <div class="http3">
      <el-card>
        <span>开始时间</span
        ><el-input type="text" v-model="start_time" style="width:200px"/>
        <span>结束时间</span
        ><el-input type="text" v-model="end_time" style="width:200px"/>
        <span>因子id</span
        ><el-input type="text" v-model="factor_id" style="width:200px"/>
        <span>股票代码</span
        ><el-input type="text" v-model="symbol" style="width:200px"/>
        <el-button @click="find">查询</el-button>
        <el-button type="primary"
          ><router-link to="/" style="text-decoration: none;color:#FFFFFF;"
            >返回</router-link
          ></el-button
        >
        <el-button type="primary"
          ><router-link
            to="/factors_data"
            style="text-decoration: none;color:#FFFFFF;"
            >因子数据</router-link
          ></el-button
        >
        <el-table
          :data="
            list_data
              .slice(
                (this.currentPage - 1) * this.pagesize,
                this.currentPage * this.pagesize
              )
              .filter(
                data =>
                  !search1 ||
                  data.tsCode.toLowerCase().includes(search1.toLowerCase())
              )
          "
          stripe
          :height="tableHeight"
          style="width: 100%"
        >
          <template v-for="(col, key) in list_title">
            <el-table-column
              :show-overflow-tooltip="true"
              :prop="toHump(col.field1EnName)"
              :label="col.field1CnName"
              :key="key"
              :class-name="toHump(col.field1EnName)"
            >
            </el-table-column>
          </template>
        </el-table>
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="currentPage"
          :page-sizes="[5, 10, 20, 50]"
          :page-size="pagesize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="list_data.length"
          :small="true"
        >
        </el-pagination
      ></el-card>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      msg: '',
      total: 0,
      data: [],
      myData1: {
        time: ''
      },
      myData11: [],
      myData3: {
        time: ''
      },
      myData33: [],
      myData44: [],
      search1: '',
      search2: '',
      //    分页
      currentPage: 1,
      pagesize: 10,
      list_title: [],
      list_data: [],
      start_time1: null,
      end_time1: null,
      factor_id1: null,
      factor_id: 8,
      start_time: 20210601,
      end_time: 20210701,
      symbol1: null,
      symbol: '000001.SZ'
    }
  },
  // mounted: function () {
  //   this.getUserList()
  // },

  methods: {
    toHump(name) {
      return name.replace(/_(\w)/g, function(all, letter) {
        return letter.toUpperCase()
      })
    },
    handleSizeChange: function(size) {
      this.pagesize = size
      console.log(this.pagesize) // 每页下拉显示数据
    },
    handleCurrentChange: function(currentPage) {
      this.currentPage = currentPage
      console.log(this.currentPage) // 点击第几页
    },
    fmtDate(obj) {
      obj = typeof obj === 'number' ? obj : Number(obj)
      var date = new Date(obj)
      var y = 1900 + date.getYear()
      var m = '0' + (date.getMonth() + 1)
      var d = '0' + date.getDate()
      return (
        y +
        '-' +
        m.substring(m.length - 2, m.length) +
        '-' +
        d.substring(d.length - 2, d.length)
      )
    },
    find() {
      this.start_time1 = this.start_time
      this.end_time1 = this.end_time
      this.factor_id1 = this.factor_id
      this.symbol1 = this.symbol
      if (this.end_time1 - this.start_time1 < 101) {
        this.getUserList()
        this.getdata()
      } else {
        alert('查询时间建议不超过一个月！')
      }
    },
    getUserList() {
      this.$axios
        .get(
          'http://121.196.123.12:8095/lmdfactors/lmd_factors_fields?factor_id=' +
            this.factor_id1
        )
        .then(res => {
          console.log(res.data)
          const listTitle = []
          for (let i = 0; i < res.data.data.factors.length; i++) {
            listTitle.push(res.data.data.factors[i])
          }
          this.list_title = listTitle
        })
    },
    getdata() {
      this.$axios
        .get(
          'http://121.196.123.12:8095/lmdfactors/lmd_factors_by_symbol?factor_id=' +
            this.factor_id1 +
            '&symbol=' +
            this.symbol1 +
            '&start_time=' +
            this.start_time1 +
            '&end_time=' +
            this.end_time1
        )
        .then(res => {
          console.log(res.data)
          const listData = []
          for (let i = 0; i < res.data.data.factors.length; i++) {
            listData.push(res.data.data.factors[i])
          }
          this.list_data = listData
        })
    }
  },
  created() {
    // 3. 动态计算表格高度
    const windowHeight =
      document.documentElement.clientHeight || document.body.clientHeight
    // 此处减去100即为当前屏幕内除了表格高度以外其它内容的总高度，
    this.tableHeight = windowHeight - 150
  }
}
</script>
